image map HTML5

An image with multiple hyperlinks is called an image map.

The clickable regions on the image is called as hotspots.

image map have two type 1) clinet side 2)server side ( we use only clinet side image map .)

tags of image map

1) img

use to insert image on web page

usemap attribute of (img) use , preceded with a # symbol .

usemap attribute indicates that the image is a client side image map.

2) map

this attribute specifies name of image .

value of the this map is specified in usemap attribute(#----) .

3) area

defines specific clickable region.

it is singular tag.

map contain multiple area within it.

attribute= Href(difines the URL) , Shape(rect{4 point}, circle{3 point} ,poly{ variable point}), coords (rect{4 point}, circle{3 point} ,poly{ variable point}),alt(extra information about clckable area)

syntax

img src="name.mp4" usemap="#imagemap" alt="to fix some" height="" width=""

map name=imagmap

area href=" web name " shape=" " coords=" " alt="name of web"

area href=" web name " shape=" " coords=" " alt="name of web"

map close tag

EXAMPLE